#WebGL-output {
  background-color: #000;
  overflow: hidden;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: -1; }

.eux-logo {
  line-height: 64px;
  margin-left: 12px; }

.eux-nav {
  max-width: 800px;
  margin: 0 auto;
  float: none; }

.eux-elogo {
  background: url("/dist/img/common/elogo.png") right no-repeat;
  width: 62px;
  height: 35px;
  background-size: 100%;
  display: inline-block;
  margin-top: 15px; }

.eux-icon-user {
  margin-right: 3px; }

#eux-collapse-btn {
  position: absolute;
  top: 20px;
  right: 16px;
  color: #e5e5e5;
  text-decoration: none;
  display: none; }

#eux-collapse-btn:hover {
  color: #fff; }

#eux-close-side {
  display: none; }

#star {
  background: #000;
  background: -webkit-radial-gradient(#0d141a, #1a2733);
  background: -o-radial-gradient(#0d141a, #1a2733);
  background: -moz-radial-gradient(#0d141a, #1a2733);
  background: radial-gradient(#0d141a, #1a2733);
  display: block; }

.decoration {
  position: absolute; }

.decoration1 {
  bottom: 10%;
  right: 15%; }

.decoration2 {
  top: 10%;
  left: 15%; }

.opacity-navbar {
  opacity: 0.6; }
  .opacity-navbar:hover {
    opacity: 1;
    -webkit-transition: opacity .5s;
    -moz-transition: opacity .5s;
    -ms-transition: opacity .5s;
    -o-transition: opacity .5s;
    transition: opacity .5s; }

#sign {
  position: fixed;
  top: 50%;
  left: 0;
  display: block;
  width: 93px;
  height: 143px;
  margin-top: -70px; }

.index-main {
  width: 768px;
  margin: 0 auto; }
  .index-main h1 {
    width: 683px;
    margin: 0 auto;
    position: relative;
    margin-top: 194px;
    height: 168px; }
    .index-main h1 img {
      position: absolute;
      left: 0;
      top: 0; }
  .index-main footer {
    width: 100%;
    text-align: center;
    margin-top: 50px; }
    .index-main footer p {
      color: #808080;
      margin-bottom: 16px; }
      .index-main footer p a {
        color: #808080; }
        .index-main footer p a:hover {
          color: #fff; }

.eux-nav-main {
  margin-top: 70px;
  border-top: 2px solid #283746;
  border-bottom: 2px solid #283746;
  padding: 15px 0; }
  .eux-nav-main li a {
    display: block;
    width: 100%;
    height: 100%;
    text-align: center;
    line-height: 45px;
    text-decoration: none;
    color: #808080; }
    .eux-nav-main li a:hover {
      background-color: rgba(48, 56, 64, 0.4);
      color: #fff;
      letter-spacing: 25px;
      font-size: 130%;
      transition: all .2s; }

.about a {
  display: block;
  width: 248px;
  height: 46px;
  border: 2px solid #3191f1;
  margin: 30px auto;
  text-align: center;
  line-height: 44px;
  font-weight: bold;
  color: #fff;
  text-decoration: none; }
  .about a:hover {
    background-color: #3191f1;
    transition: all .2s;
    color: #fff; }

.eux-nav-main {
  animation: slidedown 2s;
  overflow: hidden; }

@keyframes slidedown {
  from {
    max-height: 0; }
  to {
    max-height: 300px; } }

.eux-icon-close {
  position: absolute;
  right: 16px;
  top: 16px;
  text-decoration: none; }

.eux-message {
  display: none;
  position: fixed;
  top: 50%;
  transform: translateY(-50%);
  left: 50%;
  width: 800px;
  margin-left: -400px;
  padding: 60px 40px;
  padding-top: 80px;
  background-color: #474766;
  z-index: 10000; }
  .eux-message .form-group input, .eux-message .form-group textarea {
    width: 100%;
    padding: 6px 12px;
    background-color: #62628c;
    color: #ccc;
    border: none; }
  .eux-message .btn {
    width: 120px; }

@media (max-width: 1400px) {
  .index-main {
    width: 475px; }
    .index-main h1 {
      width: 400px;
      height: 120px;
      margin-top: 30%; }
      .index-main h1 img {
        width: 400px; }
    .index-main .eux-nav-main {
      margin-top: 40px; }
      .index-main .eux-nav-main li a {
        line-height: 35px; }
    .index-main .about a {
      line-height: 32px;
      width: 160px;
      height: 36px; }
    .index-main footer p {
      padding-top: 16px;
      margin-bottom: 0; }
  .decoration1 {
    right: 5%; } }
